index2Array = function(index) {
    var result = [];
    $.each((index + ".0").split('.'),function(index, value) { result.push(parseInt(value)); });
    return result;
}

loadFile = function(index) {
    $(".content_isd").load(main.files[index] + ".html");
    $(".content_text_head").fadeTo(500, 0 , function() { $(this).html(main.titles[index]).fadeTo(500,1);}).attr("title", main.files[index] + ".html");
}

prevSlide = function(index, event) {
    var idx = index2Array(index);
    sub = null;
    idx[0] = idx[0] > 0 ? --idx[0] : main.pages.length - 1;
    loadFile(idx[0]);
    return idx[0] + "." + idx[1];
}

nextSlide = function(index, event, skip) {
    var idx = index2Array(index);
    if (sub && !sub.next() && (typeof skip === 'undefined' || !skip)) {
	sub.step();
	idx[1]++;
    } else {
	sub = null;
	loadFile(idx[0]);
	idx[0] = idx[0] < main.pages.length - 1 ? ++idx[0] : 0;  
	idx[1] = 0;
    }
    return idx[0] + "." + idx[1];
}

$(document).ready(function() {
	sub = null;
	main = {pages: [], files: [], titles: [], index: "0.0"};
	
	var ix = 0;
	$(".pages").each(function() {
		main.pages[ix++] = $(this).html();
	});
	ix = 0;
	$(".files").each(function() {
		main.files[ix++] = $(this).text();
	});			
	ix = 0;
	$(".titles").each(function() {
		main.titles[ix++] = $(this).text();
	});			
	$(".content_iframe").attr("src", main.files[0] + ".html");
	$(".content_text_head").fadeTo(0, 0, function() {
		$(this).html(main.titles[0]).show().fadeTo(1000, 1); 
	});
	$(".content_text_text").fadeTo(0, 0, function() {
		$(this).html(main.pages[0]).show().fadeTo(1000, 1); 
	});
	$(window).keydown(function(evt) { 
	    if (evt.keyCode === 32 || evt.keyCode === 39) main.index=nextSlide(main.index, evt);
	    });


    var dd = document.createElement('select');
    dd.setAttribute('id', 'dropdownbox');
    dd.setAttribute('class', 'dropdownbox');
//    dd.setAttribute('onchange', '$(".content_iframe").attr("src", document.getElementById("dropdownbox").value + ".html"); $(".content_text_head").fadeTo(500, 0, function() {	$(this).html(main.titles[ix]).show().fadeTo(1000, 1); }); $(".content_text_text").fadeTo(500, 0, function() { $(this).html(main.pages[ix]).show().fadeTo(1000, 1); });');
    $('.center_div')[0].appendChild(dd);
	$(".dropdownbox").change(function(evt) {
        var idx = document.getElementById('dropdownbox').value;
        ix = idx;
		$(".content_text_head").fadeTo(500, 0, function() {
			$(this).html(main.titles[idx]).show().fadeTo(1000, 1); 
		});
		main.index=nextSlide(idx, evt, true);
	});

    for(ix=0; ix < main.files.length; ix++) {
        var option = document.createElement('option');
        option.appendChild(document.createTextNode(main.titles[ix]));
        option.setAttribute('value', '' + ix);
    
        dd.appendChild(option);
    }
	
	$(".content_nav_left").fadeTo(0, 0.6);
	$(".content_nav_left").bind('mouseover', function(evt) { $(evt.target).fadeTo(500, 1); });
	$(".content_nav_left").bind('mouseout', function(evt) { $(evt.target).fadeTo(500, 0.6); });
	$(".content_nav_left").bind('click', function(evt) {
		main.index = prevSlide("" + main.index, evt);
	});
	$(".content_nav_right").fadeTo(0, 0.6);
				    $(".content_nav_right").bind('mouseover', function(evt) { $(evt.target).fadeTo(500, 1); });
	$(".content_nav_right").bind('mouseout', function(evt) { $(evt.target).fadeTo(500, 0.6); });
        $(".content_nav_right").bind('click',function(evt) {
		main.index = nextSlide("" + main.index, evt);
	});
	main.index = nextSlide("0", null, true);
});

animateCode = function(class1, class2) {
    $("." + class1).animate({width: 0}, 2500
			    , function() {
				$("." + class1).hide();
				$("." + class2).css({width: 0}).show().animate({width : "100%"}, 2500);});
}


removeBullets = function(class1) {
	$("li").each(function(index,el){ if ($(el).hasClass(class1)) {$(el).animate({height:0},1500, function() {$(el).hide();}) }});
}

shuffleBullets = function(class1, class2) {
    $(".step8").show();
    $("." + class2).css('position','relative');
    $("." + class1).css('position','relative');
    var diff = $("." + class2).position().top - $("." + class1).position().top;
    $("." + class2).animate({top: -diff});
    $("." + class1).animate({top: diff}, {complete: function() {
		//          $("." + class1).css({'position': 'static', 'top': 0});
		//          $("." + class2).css({'position': 'static', 'top': 0}); 
    }});
};
